<div class="managehost">
    <h3>单主机管理页面</h3>
    <div>
        <!-- 显示主机IP 和Hostname传值时使用 -->
        <div class="Ip">当前管理主机:<span id="Ip">{{ ip }}</span><span id="HostName">({{ hostname }})</span></div>
    </div>
    <div class="Cron-list">
    <table class="table table-bordered table-hover">
        <tr>
            <th>Id</th>
            <th>执行用户</th>
            <th>分</th>
            <th>时</th>
            <th>日</th>
            <th>月</th>
            <th>周</th>
            <th>执行命令</th>
            <th>状态</th>
            <th>操作</th>
        </tr>

        {{ data }}
        {%  for k,v in data.items  %}
            {% for kk,vv in v.items %}
        <tr>
            <td>
                {{ kk }}
            </td>
        <td>
            {{ k }}
        </td>
        <td>{{ vv.crontab.Minute }}</td>
        <td>{{ vv.crontab.Hour }}</td>
        <td>{{ vv.crontab.Day }}</td>
        <td>{{ vv.crontab.Month }}</td>
        <td>{{ vv.crontab.Week }}</td>
        <td>{{ vv.crontab.Command|safe }}</td>
            {% if vv.Active == 0 %}
            <td id="0">未生效</td>
            {% elif vv.Active == 1 %}
            <td id="1">生效</td>
            {% else %}
                <td>异常</td>
            {% endif %}
        <td><a class="Editbutton">编辑</a></td>
        </tr>
        {% endfor %}
        {% endfor %}
    </table>
    </div>

<!-- 修改弹窗 -->
<div class="Edit-Cron">
    <div><div class="InputDesc">执行用户：</div><input type="text" class="InputUser" name="ahhhhhh"></div>
    <div><div class="InputDesc">分：</div><input type="text" class="InputMin"></div>
    <div><div class="InputDesc">时：</div><input type="text" class="InputHour"></div>
    <div><div class="InputDesc">日：</div><input type="text" class="InputDay"></div>
    <div><div class="InputDesc">月：</div><input type="text" class="InputMon"></div>
    <div><div class="InputDesc">周：</div><input type="text" class="InputWeek"></div>
    <div><div class="InputDesc">执行命令：</div><input type="text" class="InputComm"></div>
    <div><div class="InputDesc">是否生效：</div><input type="text" class="InputStatu"></div>
    <div><input type="button" value="提交" class="SubmitChange"><input type="button" value="取消" class="cancel"></div>
</div>
    <p><a href="javascript: void(0)">返回</a></p>


</div>


<script type="text/javascript">
    $(
        function () {
            $("p a").click(function () {
                $(".menu li.active a").click();
            });
            <!-- 弹出修改框，并获取默认内容 -->
            $(".Editbutton").click(function () {
                var Id = $(this).parents("td").parents("tr").find("td").eq(0).html().trim();
                var User = $(this).parents("td").parents("tr").find("td").eq(1).html().trim();
                var Min = $(this).parents("td").parents("tr").find("td").eq(2).html().trim();
                var Hour = $(this).parents("td").parents("tr").find("td").eq(3).html();
                var Day = $(this).parents("td").parents("tr").find("td").eq(4).html();
                var Month = $(this).parents("td").parents("tr").find("td").eq(5).html();
                var Week = $(this).parents("td").parents("tr").find("td").eq(6).html();
                var Command = $(this).parents("td").parents("tr").find("td").eq(7).html();
                var Status = $(this).parents("td").parents("tr").find("td").eq(8).attr("id");
                alert(Status);
                $(".Edit-Cron").attr("id", Id);
                $(".InputUser").val(User);
                $(".InputMin").val(Min);
                $(".InputHour").val(Hour);
                $(".InputDay").val(Day);
                $(".InputMon").val(Month);
                $(".InputWeek").val(Week);
                $(".InputComm").val(Command);
                $(".InputStatu").val(Status);
                $(".Edit-Cron").css("display","block");
            });
            <!-- 提交修改 -->
            $(".SubmitChange").click(function () {
                var IpAddress = $(".Ip #Ip").html();
                var HostName = $(".Ip #Host").html();
                var Id = $(".Edit-Cron").attr("id");
                var User = $(".InputUser").val();
                var Min = $(".InputMin").val();
                var Hour = $(".InputHour").val();
                var Day = $(".InputDay").val();
                var Month = $(".InputMon").val();
                var Week = $(".InputWeek").val();
                var Statu = $(".InputStatu").val();
                var Command = $(".InputComm").val();
                CronData = {
                    "id" : Id,
                    "ipaddress": IpAddress,
                    "hostname": HostName,
                    "user" : User,
                    "minute" : Min,
                    "hour" : Hour,
                    "day" : Day,
                    "month" : Month,
                    "week" : Week,
                    "statu" : Statu,
                    "command" : Command
                };
                <!-- 提交数据 -->
                $.ajax({
                    url: '/changecron/',
                    type: 'POST',
                    data: {
                        "ss" : JSON.stringify(CronData)
                    },
                    dataType: 'json',
                    success: function (result) {
                        alert(result);
                    },
                    error: function (result) {
                        alert(result);
                    }
                })

            });
            $(".cancel").click(function () {
                $(".Edit-Cron").css("display","none");
            });
    })
</script>